<template>
  <div class="exam" style="margin:0 100px">
    考试名称<el-input
      placeholder="请输入考试名称"
      v-model="input1"
      clearable
      style="width: 300px"
    >
    <!-- </el-input>
    试卷名称<el-input
      placeholder="请输入试卷名称"
      v-model="input2"
      clearable
      style="width: 300px"
    > -->
    </el-input>
    &nbsp;
    &nbsp;&nbsp;
    审批状态
    <el-select
      v-model="value1"
      clearable
      placeholder="审批状态"
      style="width: 200px"
    >
      <el-option value="0" label="已批改或考生还未答题"> </el-option>
      <el-option label="未批改" value="1"> </el-option>
    </el-select>
    <br />
    <br />
    <el-row>
      <el-button type="primary" round @click="search">查询</el-button>
      <el-button type="primary" round plain @click="reset">重置</el-button>
    </el-row>
    <br />
    <!-- 表格 -->
    <el-table
      :data="tableData"
      stripe
      style="width: 100%"
      border
      ref="listRef"
      :header-cell-style="{ 'text-align': 'center' }"
    >
      <el-table-column type="selection" width="50" align="center">
      </el-table-column>
      <el-table-column
        label="序号"
        width="60"
        type="index"
        :index="indexMethod"
        align="center"
      >
      </el-table-column>
      <el-table-column prop="examEname" label="考试名称"> </el-table-column>
      <!-- <el-table-column prop="paperAttribute.name" label="试题名称"> -->
        <!-- <template slot-scope="scope">
            <span
              v-if="scope.row.quTypeId == item.id"
              v-for="item in options1"
              :key="item.id"
              :value="item.id"
              >{{ item.name }}</span
            >

          </template> -->
      </el-table-column>
      <el-table-column
        prop="examineeInformationList.length"
        label="考生人数"
        align="center"
        width="80"
      >
        <!-- <template slot-scope="scope">
            <span
              v-if="scope.row.complexity == item.id"
              v-for="item in options2"
              :key="item.id"
              :value="item.id"
              >{{ item.hardLevel }}</span
            >

          </template> -->
      </el-table-column>
      <el-table-column
        prop="isCorrect"
        label="审批状态"
        width="200"
        align="center"
      >
        <template slot-scope="scope">
          <span v-if="scope.row.isCorrect == 0">已批改或考生还未答题</span>
          <span v-else-if="scope.row.isCorrect != 0" style="color:red">未批改</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" width="130">
        <template slot-scope="scope">
            <!-- <el-button @click="handleClick(scope.row)" type="text" size="small"
              >查看</el-button
            >
            <el-button type="text" size="small" @click="updateOne(scope.row)"
              >修改</el-button
            >
            <el-button type="text" size="small" @click="deleteOne(scope.row)"
              >删除</el-button
            > -->
            <el-button v-if="scope.row.isCorrect == 0" @click="handleClick(scope.row)" type="text" size="small"
              >查看</el-button
            >
            <el-button v-if="scope.row.isCorrect != 0" @click="handleClick(scope.row)" type="text" size="small" style="color:red"
              >批改</el-button
            >
          </template>

      </el-table-column>
    </el-table>
    <Pagination
      v-bind:child-msg="pageparm"
      @callFather="callFather"
    ></Pagination>
  </div>
</template>

<script>
import Pagination from "../common/Pagination.vue";
export default {
  components: { Pagination },
  data() {
    return {
      //两个输入框
      input1: "",
      // input2: "",
      //下拉框
      value1: "",

      tableData: "",

      searchData: {
        examEname: "",
        isCorrect: "",
      },

      formInline: {
        page: 1,
        limit: 5,
      },
      // 分页参数
      pageparm: {
        currentPage: 1,
        pageSize: 5,
        total: 10,
      },
    };
  },
  created() {
    this.showAll();
  },
  methods: {
    //展示所有
    showAll() {
      this.$axios
        .get(
          "/api/correctExamController/showAll/" +
            this.pageparm.currentPage +
            "/" +
            this.pageparm.pageSize
        )
        .then((res) => {
          // console.log(res);
          this.tableData = res.data.data.list;
          // 分页赋值
          this.pageparm.currentPage = this.formInline.page;
          this.pageparm.pageSize = this.formInline.limit;
          this.pageparm.total = res.data.data.total;
          // console.log(this.tableData);
        })
        .catch(() => {});
    },
    //查询
    search() {
      // alert("查询");
      this.searchData.examEname = this.input1;
      this.searchData.isCorrect = this.value1;
      this.$axios
        .post(
          "/api/correctExamController/findLike/" +
            this.pageparm.currentPage +
            "/" +
            this.pageparm.pageSize,
          this.searchData
        )
        .then((res) => {
          // console.log(res);
          this.tableData = res.data.data.list;
          // 分页赋值
          this.pageparm.currentPage = this.formInline.page;
          this.pageparm.pageSize = this.formInline.limit;
          this.pageparm.total = res.data.data.total;
        })
        .catch(() => {});
    },
    //查看详情
    handleClick(data) {
    //  console.log(data);
     this.$router.push({
        name: "lookOrCorrect", //路由配置中的name
        params: {
          data
        },
      });
    },
    //重置
    reset() {
      this.input1 = "";
      this.value1 = "";
      this.searchData.examEname = this.input1;
      this.searchData.isCorrect = this.value1;
      this.showAll();
    },
    // 分页插件事件
    callFather(parm) {
      this.formInline.page = parm.currentPage;
      this.formInline.limit = parm.pageSize;
      this.pageparm.currentPage = this.formInline.page;
      this.pageparm.pageSize = this.formInline.limit;
      // console.log(this.question);
      this.selectByType();
    },
    selectByType() {
      if (this.searchData.examEname == "" && this.searchData.isCorrect == "") {
        this.showAll();
      } else {
        this.search();
      }
      // this.showAll();
    },
    //序号处理
    indexMethod(index) {
      return (
        (this.pageparm.currentPage - 1) * this.pageparm.pageSize + index + 1
      );
    },
  },
};
</script>

